<!-- 学生课程管理-课程管理 -->
<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<meta name="renderer" content="webkit">
		<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
		<meta name="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" />
		<link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />
		<link rel="stylesheet" href="/css/font.css">
		<link rel="stylesheet" href="/css/xadmin.css">
	</head>

	<body>
		<div class="x-body" id="app">
			<xblock class="layui-form">
				<button class="layui-btn layui-btn-danger" onclick="delAll()"><i class="layui-icon"></i>批量删除</button>
				<button class="layui-btn" onclick="open_addCourse()"><i class="layui-icon"></i>添加课程</button>
				<a class="layui-btn layui-btn-small" style="line-height:1.6em;margin-top:3px;float:right" href="javascript:location.replace(location.href);"
				 title="刷新"><i class="layui-icon" style="line-height:30px">ဂ</i></a>
				<span class="x-right" style="line-height:40px">共有数据：{{ teacherCourses.length }} 条</span>
			    <input type="hidden" name="teacherNo" th:attr="value=${teacherNo}"/>
                <input type="hidden" name="orgId" th:attr="value=${orgId}"/>
			</xblock>
			<table class="layui-table">
				<thead>
					<tr>
						<th width="20">
							<div class="layui-unselect header layui-form-checkbox" lay-skin="primary"><i class="layui-icon">&#xe605;</i></div>
						</th>
						<th>课程代码</th>
						<th>课程名称</th>
						<th width="60">课程性质</th>
						<th width="50">上课星期</th>
                        <th width="60">上课时间</th>
                        <th>授课教室</th>
                        <th>每周次数</th>
                        <th>所属专业</th>
						<th width="150">操作</th>
				</thead>
				<tbody>
					<tr v-for="teacherCourse in teacherCourses">
						<td>
							<div class="layui-unselect layui-form-checkbox" lay-skin="primary" :data-id='teacherCourse.id' :data-courseName="teacherCourse.courseName"><i class="layui-icon">&#xe605;</i></div>
						</td>
						<td>{{ teacherCourse.courseNo }}</td>
						<td>{{ teacherCourse.courseName }}</td>
						<td v-if="teacherCourse.courseType == 1">必修</td>
                        <td v-else-if="teacherCourse.courseType == 2">专业选修</td>
						<td>{{ teacherCourse.startDay }}</td>
						<td>{{ teacherCourse.startTime }}</td>
						<td>{{ teacherCourse.roomName }}</td>
						<td>{{ teacherCourse.number }}</td>
						<td>{{ teacherCourse.majorName }}</td>
						<td class="td-manage">
						    <button v-if="teacherCourse.courseType == 1" class="layui-btn layui-btn-sm" onclick="setMajorCourse(this)" :number="teacherCourse.number" href="javascript:;"><i
                                 class="layui-icon">&#xe614;</i>设置</button>
						    <button v-if="teacherCourse.courseType != 1" class="layui-btn layui-btn-sm" onclick="setChoosCourse(this)" href="javascript:;"><i
                                 class="layui-icon">&#xe614;</i>设置</button>
							<button class="layui-btn-danger layui-btn layui-btn-sm" onclick="member_del(this)" href="javascript:;"><i
								 class="layui-icon">&#xe640;</i>删除</button>
						</td>
					</tr>
				</tbody>
			</table>
		</div>
		<script type="text/javascript" src="/js/jquery.min.js"></script>
        <script type="text/javascript" src="/js/xadmin.js"></script>
        <script type="text/javascript" src="/lib/layui/layui.js" charset="utf-8"></script>
        <script type="text/javascript" src="/js/vue.min.js"></script>
        <script type="text/javascript" src="/js/jquery.form.js"></script>
		<script>
			var vm = new Vue({
	            el : '#app',
	            data : {
	                // 当前教师的所有课程
	                teacherCourses : "",
	                // 当前教师编号
	                teacherNo:"",
	                // 当前教师所在的院系id
	                orgId : ""
	            },
	            created : function() {
	                this.teacherNo = $("input[name='teacherNo']").val();
	                this.orgId = $("input[name='orgId']").val();
	                // 获取当前教师的课程列表
	               this.listTeacherCourse(this.teacherNo);
	            },
	            methods : {
	            	listTeacherCourse : function(teacherNo) {
	                    var vm = this;
	                    $.ajax({
	                        url : "/sys/teacher/course/listTeacherCourse",
	                        data: {
	                        	teacherNo: teacherNo
	                        },
	                        type : "get",
	                        success : function(result) {
	                            if (result.state) {
	                                vm.teacherCourses = result.data;
	                            } else {
	                                layui.use(['layer'], function(){
	                                    var layer = layui.layer
	                                    layer.msg(""+result.msg, {icon: 5});
	                                });
	                            }
	                        }
	                    });
	                }
	            }
	        });

			// 添加课程
			function open_addCourse() {
				x_admin_show('添加课程','/sys/teacher/course/toAddCourse?orgId=' + vm.orgId + "&teacherNo=" + vm.teacherNo, 600, 400);
			}
			
			// 单个删除
			function member_del(obj) {
				var courseName = $(obj).parents("tr").find("div:first").attr("data-courseName");
				var id = $(obj).parents("tr").find("div:first").attr("data-id");
				var tchCourseId = [];
				tchCourseId.push(id);
				layer.confirm('确认要删除【' + courseName + '】吗？', function(index) {
					$.ajax({
						url: "/sys/teacher/course/delTeacherCourse",
						type: "post",
						data: {
							tchCourseId: tchCourseId
						},
						success: function(result) {
							if (result.state) {
								layer.msg('删除成功!', {
									icon: 1,
									time: 1000
								});
								vm.listTeacherCourse(vm.teacherNo);
							} else {
								layer.msg("" + result.msg, {
									icon: 5
								});
							}
						}
					});
				});
			}

			// 批量删除
			function delAll(argument) {
				var tchCourseId = tableCheck.getData();
				if (tchCourseId.length <= 0) {
					return;
				}
				// 获取选中的课程名称
				var obj = $(".layui-form-checked").not('.header');
				var courseName = [];
				obj.each(function(index, el) {
					courseName.push(obj.eq(index).attr('data-courseName'));
				});
				layer.confirm('确认要删除【' + courseName + '】吗？', function(index) {
					$.ajax({
						url: "/sys/teacher/course/delTeacherCourse",
						type: "post",
						data: {
							tchCourseId: tchCourseId
						},
						success: function(result) {
							if (result.state) {
								layer.msg('删除成功', {
									icon: 1
								});
								// 移除所有checkbox的勾选状态
								$(".layui-form-checkbox").removeClass('layui-form-checked');
								vm.listTeacherCourse(vm.teacherNo);
							} else {
								layer.msg("" + result.msg, {
									icon: 5
								});
							}
						}
					});
				});
			}
			
			// 设置主修课程
			function setMajorCourse(obj) {
				var courseId = $(obj).parents("tr").find("div:first").attr("data-id");
				var oldNumber = $(obj).attr("number");
				layer.open({
                    type: 1, //Page层类型
                    btn: ["确定", "取消"],
                    title: '设置每周次数',
                    skin: 'layui-layer-prompt',
                    content: "<input type='number' value='"+oldNumber+"' class='layui-layer-input' placeholder='每周次数，1~2位数字'>",
                    yes: function(index, layero) {
                        // 按钮【按钮一】的回调
                        var number = $(layero).find("input[type='number']").val();
                        // 数据检验
                        if (number < 1 || number > 10) {
                            layer.msg('每周次数，1~2位数字', {
                                icon: 5,
                                time: 1000
                            });
                            return;
                        }
                        // 保存
                        $.ajax({
                            url: "/sys/teacher/course/updateTchCourse",
                            data: {
                            	id: courseId,
                            	number: number
                            },
                            type: "post",
                            success: function(result) {
                                if (result.state) {
                                    layer.msg("设置成功", {
                                        icon: 1
                                    });
                                    vm.listTeacherCourse(vm.teacherNo);
                                    // 关闭
                                    layer.close(index);
                                } else {
                                    layer.msg("" + result.msg, {
                                        icon: 5
                                    });
                                }
                            }
                        });
                    }
                })
			}
			// 设置选修课程
			function setChoosCourse(obj) {
				var courseId = $(obj).parents("tr").find("div:first").attr("data-id");
				var courseName = $(obj).parents("tr").find("div:first").attr("data-courseName");
                x_admin_show('编辑课表['+ courseName +']','/sys/teacher/course/toCourseTimeEdit?tchCourseId=' + courseId, 600, 350);
			}
			// 设置回调
			function updateEditData() {
				vm.listTeacherCourse(vm.teacherNo);
			}
		</script>
	</body>

</html>
